PWA = Progressive Web Accesibility
PWA = Progressive Web App であるが
PWA = Progressive Web Accesibility という話をしてみたい
Webアクセシビリティってなんじゃい
誰がためにアクセシビリティ対応をするのか?とか見てくれ
5つ星オープンデータ
https://5stardata.info/ja/
ティム・バーナーズ=リーが提唱したオープンデータのための5つ星スキーム
星1
(どんな形式でも良いので) あなたのデータをオープンライセンスでWeb上に公開しましょう
PWAの強み
https://scandiweb.com/blog/improve-website-accessibility-with-progressive-web-apps
遅いインターネット接続で動作している何十億人ものユーザーや、帯域幅が限られているユーザーに対して、より良い体験を保証することができる
速度制限にも当てはまる
データ容量を気にしなくても良い
更新データのダウンロードで容量を圧迫
Webの体験をすることができる
URLを公開してリンクさせるだけでアクセスできる
Webアクセシビリティを提供できる
年々アクセシビリティ対応の必要性は上がってきている
災害時の情報アクセス手段
コロナ禍におけるアクセス
スクリーンネームでソーシャルディスタングをするのをやめろ
生活と意見: ソーシャルディスタンスなどと称してユーザー名や文章にスペースを挟む行為についての苦情
特に公式アカウント
https://www.youtube.com/watch?v=1qqZIeQNuxE
https://web.dev/pwa-checklist/
Is fully accessible
All user interactions pass WCAG 2.0 accessibility requirements.
Why
Most people at some point in their life will want to take advantage of your PWA in a way that is covered under the WCAG 2.0 accessibility requirements. Humans' ability to interact with and understand your PWA exist on a spectrum and needs can be temporary or permanent. By making your PWA accessible, you ensure it's usable for everyone.
完全にアクセシブルか
すべてのユーザーインタラクションは、WCAG 2.0アクセシビリティ要件を満たしています。
それは何故
ほとんどの人は、人生のどこかで、WCAG 2.0 アクセシビリティ要件の下でカバーされている方法でPWAを利用したいと思うでしょう。
人の対話能力や理解能力には様々なものがあり、そのニーズは一時的なものであったり、永続的なものであったりします。
PWAをアクセシブルにすることで、誰もが利用できるようになります。
モバイルアプリのアクセシビリティチェックする要件
PWAで共通のアプリケーションを作ることはモバイルより優れている?
優劣の問題ではないけど
Webの恩恵を得られることは良い
ここからベスト・プラクティスを引っ張ってこれそう?
手触りのよいウェブを考える / better-mobile-web
SPA/PWA時代のWebデザインのお作法 / Stateful Web Design - Speaker Deck
https://a11yj.slack.com/archives/C097ZKPAL/p1572881329033000
サーバーサイドとアクセシビリティ
Webアプリケーションで、セッションタイムアウトの制限を変更することができるのか
https://waic.jp/docs/UNDERSTANDING-WCAG20/time-limits-required-behaviors.html
入力値のバリデーションを適切に行なっているのか
https://waic.jp/docs/UNDERSTANDING-WCAG20/minimize-error-identified.html
サブミットした値を取り消す手段を提供しているか
https://waic.jp/docs/UNDERSTANDING-WCAG20/minimize-error-reversible.html
入力エラーが自動的に検出され、修正方法を提案できる場合、その提案が利用者に提示される
https://waic.jp/docs/UNDERSTANDING-WCAG20/minimize-error-suggestions.html
クライアントキャッシュをうまく組み合わせれば、インターネット環境がなくてもアクセスできるのでは?
オフラインサポート
https://developers.google.com/web/fundamentals/instant-and-offline/web-storage/offline-for-pwa
NVDA
スクリーンリーダー
YouTubeのSPAが認識できない問題
アクセシビリティの祭典 2019より
https://youtu.be/OwdmK7Ce0IA?t=1708
@_tsmd: 「HTTPリクエストで素直なコンテンツが返ってこないことは、ブラウザでの閲覧とGoogleクローラの巡回をのぞくあらゆるすべてに弊害があるんだよ」と、これからも言いつづけていくつもりであるし、どんだけSPAを実装してても心のなかで鳴ってるテーマはこれなんだよな